<!-- 编目审核 -->
<script setup lang="ts">
import TableView from '@/components/TableView.vue'
import {
  NButton,
  NDataTable,
  NForm,
  NFormItem,
  NPagination,
  useMessage,
  NInput,
  NSelect,
  NSpace,
  NDatePicker,
  NTreeSelect,
  NModal,
  type FormRules,
  type DataTableColumns,
  type SelectOption,
  NTooltip,
  NGrid,
  NGi,
  NCheckboxGroup,
  NCheckbox,
  NScrollbar,
  NBadge
} from 'naive-ui'
import { h, ref, reactive, watch, type VNode, onMounted, onDeactivated } from 'vue'
import router from '@/router'
import { useRoute } from 'vue-router'
import { sendRequest } from '@/utils/api'
import VDialogContent from '@/views/OA/Common/DialogContent.vue'
import { exportExcel } from '@/utils/exportExcel'
import { set } from 'date-fns'
import Axios from 'axios'
const message = useMessage()
const route = useRoute()
const form = reactive({
  itemName: null,
  collectTypeCode: null, //征集方式
  assessStatusCode: null, //编目审核状态
  laidStatusCode: null, //入库审核状态
  recipient: null,
  assetCode: null,
  timeRange: null, //日期范围选择
  reviewType: null, //审核类型
  batchCode: null, //批次
  itemTypeCode: null, //版本
  catalogStatusCode: null,
  storageStatusCode: null, //入藏状态
  mainStatus: null
})
const reasonContent = ref()
const renderOption = ref(({ node, option }: { node: VNode; option: SelectOption }) =>
  h(NTooltip, null, {
    trigger: () => node,
    default: () => option.classificationName
  })
)
const rowKey: any = (e: any) => e.id || ''
const columns: DataTableColumns = [
  {
    type: 'selection',
    width: '1rem'
  },
  // {
  //   title: '序号',
  //   key: 'index',
  //   width: '5rem',
  //   align: 'center',
  //   render: (e, index) => {
  //     return paginationReactive.pageSize * (paginationReactive.page - 1) + index + 1
  //   }
  // },
  {
    title: '批次编号',
    key: 'batchCode',
    width: '8rem',
    align: 'center',
    ellipsis: {
      tooltip: true
    }
  },
  {
    title: '馆藏码',
    key: 'assetCode',
    width: '10rem',
    align: 'center',
    ellipsis: {
      tooltip: true
    }
  },
  {
    title: '藏品名称',
    key: 'itemName',
    width: '10rem',
    align: 'center'
    // ellipsis: {
    //   tooltip: true
    // }
  },
  {
    title: '版本类型',
    key: 'itemTypeName',
    width: '10rem',
    align: 'center'
  },
  {
    title: '征集方式',
    key: 'collectTypeName',
    width: '5rem',
    align: 'center',
    ellipsis: {
      tooltip: true
    }
  },
  {
    title: '领取人',
    key: 'catalogPeople',
    width: '5rem',
    align: 'center',
    ellipsis: {
      tooltip: true
    }
  },
  // {
  //   title: '编目审核状态',
  //   key: 'assessStatusName',
  //   width: '5rem',
  //   align: 'center',
  //   ellipsis: {
  //     tooltip: true
  //   }
  // },
  // {
  //   title: '入库审核状态',
  //   key: 'laidStatusName',
  //   width: '5rem',
  //   align: 'center'
  // },
  // {
  //   title: '入藏状态',
  //   key: 'storageStatusName',
  //   width: '5rem',
  //   align: 'center',
  //   ellipsis: {
  //     tooltip: true
  //   }
  // },
  // {
  //   title: '编目状态',
  //   key: 'catalogStatusName',
  //   width: '10rem',
  //   align: 'center',
  //   ellipsis: {
  //     tooltip: true
  //   }
  // },
  {
    title: '状态',
    key: 'status',
    align: 'center',
    render: (e: any) => {
      if (e.laidStatusCode == 'A6703') {
        return '入库拒绝'
      }
      if (e.laidStatusCode == 'A6702') {
        return '入库审核中'
      }
      if (e.assessStatusCode == 'A5011') {
        return '编目通过'
      }
      if (e.assessStatusCode == 'A5012') {
        return '编目拒绝'
      }
      if (e.assessStatusCode == 'A5010') {
        return '编目审核中'
      }
      if (e.assessStatusCode == 'A5004') {
        return '审核退回'
      }
    },
    width: '5rem'
  },
  {
    title: '操作',
    key: 'action',
    width: '10rem',
    align: 'center',
    render: (e: any) => [
      // 编目审核状态为审批中：审核、详情按钮
      // 编目审核状态为通过：审核退回、编辑、入库、详情
      // 编目审核状态为拒绝或审核退回：详情
      // 入库审核状态为审批中：详情
      // 入库审核状态为拒绝：审核退回、编辑、入库、详情
      // h(
      //   NButton,
      //   {
      //     type: 'primary',
      //     quaternary: true,
      //     style:{display:e?.ifMeFirstAudit?'inline':'none'},
      //     onClick: () => {
      //       router.push({
      //         path: '/collection/process/stepPlan/startApproveCon',
      //         query: { id: e.id, typeShow: 1, code: e?.subItemCode } //1初审 2终审
      //       })
      //     }
      //   },
      //   {
      //     default: () => '初审'
      //   }
      // ),
      // h(
      //   NButton,
      //   {
      //     type: 'primary',
      //     quaternary: true,
      //     style: { display: e?.ifMeFinalAudit ? 'inline' : 'none' },
      //     onClick: () => {
      //       router.push({
      //         path: '/collection/process/stepPlan/startApproveCon',
      //         query: { id: e.id, typeShow: 2, code: e?.subItemCode }
      //       })
      //     }
      //   },
      //   {
      //     default: () => '终审'
      //   }
      // ),
      h(
        NButton,
        {
          type: 'primary',
          quaternary: true,
          // assessStatusCode 编目审核状态 A5010 审批中  A5011 通过
          style: { display: e?.reviewFlag ? 'inline' : 'none' },
          onClick: () => {
            router.push({
              path: '/collection/process/stepPlan/startApproveCon',
              query: {
                id: e.id,
                typeShow: 1,
                code: e?.subItemCode,
                redirect: router.currentRoute.value.fullPath
              }
            })
          }
        },
        {
          default: () => '审核'
        }
      ),
      h(
        NButton,
        {
          type: 'primary',
          quaternary: true,
          // inventoryReviewCode 入库审核状态  A6703拒绝
          style: {
            display: e.reviewReturn ? 'inline' : 'none'
          },

          onClick: () => {
            router.push({
              path: '/collection/process/stepPlan/startApproveConBack',
              query: {
                id: e.id,
                typeShow: 2,
                code: e?.subItemCode,
                redirect: router.currentRoute.value.fullPath
              }
            })
          }
        },
        {
          default: () => '审核退回'
        }
      ),
      h(
        NButton,
        {
          type: 'primary',
          quaternary: true,
          style: {
            display: e.edit ? 'inline' : 'none'
          },
          onClick: () => {
            router.push({
              path: '/collection/process/StepPlan/menu',
              query: {
                id: e.subItemCode,
                type: 1,
                code: e?.itemCode,
                idCopy: e?.id,
                redirect: router.currentRoute.value.fullPath
              }
            })
          }
        },
        {
          default: () => '编辑'
        }
      ),
      h(
        NButton,
        {
          type: 'primary',
          quaternary: true,
          style: {
            display: e.inStorage ? 'inline' : 'none'
          },
          onClick: () => {
            router.push({
              path: '/collection/process/stepPlan/processUpdate',
              query: {
                id: e.id,
                code: e?.itemCode,
                type: 0,
                typeIn: 2,
                redirect: router.currentRoute.value.fullPath
              } //typeIn:1 入库
            })
          }
        },
        {
          default: () => '入库'
        }
      ),
      h(
        NButton,
        {
          type: 'primary',
          quaternary: true,
          onClick: () => {
            router.push({
              path: '/collection/process/makeMenu/selfprocessDetail',
              query: {
                id: e.subItemCode,
                type: 1,
                code: e?.subItemCode,
                idSelf: e.id,
                redirect: router.currentRoute.value.fullPath
              } //编目审核详情
            })
          }
        },
        {
          default: () => '详情'
        }
      )
    ]
  }
]

const reset = () => {
  form.itemTypeCode = null
  form.itemName = null
  form.storageStatusCode = null
  form.catalogStatusCode = null
  form.assessStatusCode = null
  form.laidStatusCode = null
  form.recipient = null
  form.assetCode = null
  form.timeRange = null
  form.reviewType = null
  form.batchCode = null
  form.collectTypeCode = null
  form.mainStatus = null
}
//筛选条件
const paginationReactive = reactive({
  page: 1,
  pageSize: 10,
  showSizePicker: true,
  pageSizes: [10, 20, 50, 100, 500],
  itemCount: 0,
  onChange: (page: number) => {
    paginationReactive.page = page
    queryTableData()
  },
  onUpdatePageSize: (pageSize: number) => {
    paginationReactive.pageSize = pageSize
    queryTableData(true)
  }
})
const piciList = ref()
const banbenList = ref()
// 捐赠、购买、交换、拨交、罚没、呈缴
const collectFactionList: any = ref()
// 初审未审核，初审通过，初审不通过，终审未审核，终审通过，终审不通过
const statusList: any = ref()
const modalVisible = ref(false)
// 批量操作 同意，拒绝
const auditBatchOperationFn = async () => {
  const [error, res] = await sendRequest({
    module: 'dispose',
    api: 'approve',
    override: {
      data: {
        resultFlag: flagAudit.value,
        fromId: formIds.value?.join(','),
        opinions: reasonContent.value
      }
    }
  })
  if (error) return message.error(error.message)
  if (res.code !== 0) return message.error(res.msg)
  modalVisible.value = false
  reasonContent.value = null
  backId.value = null
  queryTableData()
}
const againBack = async () => {
  const [error, res] = await sendRequest({
    module: 'collectProcess',
    api: 'collectItemsAssessfinalAuditBack',
    override: {
      params: {
        reviewOpinions: reasonContent.value,
        subItemCode: backId.value
      }
    }
  })
  if (error) return message.error(error.message)
  message.success(res.msg)
  modalVisible.value = false
  reasonContent.value = null
  backId.value = null
  queryTableData()
}
const backId = ref()
//点击退回
const flagAudit = ref(false) //true 批量编目审核同意 false 批量编目审核拒绝
const handleDetail = (val: any, flag: any) => {
  console.log(val)
  // backId.value = val
  flagAudit.value = flag
  reasonContent.value = [] //打开弹窗先清空内容
  modalVisible.value = true
  reasonContent.value = flag ? '同意' : '拒绝'
}

//多选框勾选
type DataListSelectionsItem = {
  id: string
}
const notIssuedId = ref()
const dataListSelections: any = ref<DataListSelectionsItem[]>([])
const formIds = ref()
const subItemCodes = ref()
function selectionChangeHandle(val: any, info: any) {
  dataListSelections.value = val
  formIds.value = info?.map((i: any) => i.fromId) || []
  notIssuedId.value = []
  info.map((i: any) => {
    if (i.distributionStatus == '0') {
      notIssuedId.value.push(i.id)
    }
  })
  subItemCodes.value = info?.map((i: any) => i.subItemCode) || []
}

const exportNowLoading = ref(false)
const outputExcelNow = async () => {
  exportNowLoading.value = true
  let columnsCopy = columns.slice(1, columns.length - 1)
  const titleArrKey = columnsCopy.map((item: any) => item.key)
  const titleArrName = columnsCopy.map((item: any) => item.title)
  const exportData = JSON.parse(JSON.stringify(tableData.value))
  const Arr = exportData.map((item: any) => {
    const obj: any = {}
    titleArrKey.map((it: any) => {
      obj[it] = item[it]
    })
    return obj
  })
  exportExcel(Arr, '编目信息列表数据', titleArrName, '编目信息列表数据')
  exportNowLoading.value = false
}

// 选择字段导出
const exportLoading = ref(false)
const showKeyListModal = ref(false)
const selectedKeys = ref<any>([])
const keysList = ref<any>([])
const indeterminate = ref(false)
const versionTypeList = ref<Array<SelectOption>>([])
const curVersionType = ref<any>(null)
const typeCode = ref(null)
versionTypeList.value = [
  {
    label: '出版物',
    value: 'CBW'
  },
  {
    label: '历史文献',
    value: 'LSWX'
  },
  {
    label: '内部资料',
    value: 'NBZL'
  },
  {
    label: '民间版本（现代印刷品）',
    value: 'MJBB'
  },
  {
    label: '邮政版本',
    value: 'YZBB'
  },
  {
    label: '金融版本',
    value: 'JRBB'
  },
  {
    label: '器物版本',
    value: 'QWBB'
  },
  {
    label: '数字版本',
    value: 'SZBB'
  },
  {
    label: '影视版本（实物）',
    value: 'YSBB'
  },
  {
    label: '工业版本（商业资料）',
    value: 'GYBB'
  }
]
const jsonList: any = {
  CBW: 'BM_TS,BM_BZQK',
  LSWX: 'BM_LSWX',
  NBZL: 'BM_NBZL',
  MJBB: 'BM_OTHER',
  YZBB: 'BM_OTHER',
  JRBB: 'BM_OTHER',
  QWBB: 'BM_QWBB',
  SZBB: 'BM_YSSZ',
  YSBB: 'BM_YSSZ',
  GYBB: 'BM_OTHER'
}

watch(
  () => selectedKeys,
  () => {
    if (selectedKeys.value.length > 0 && selectedKeys.value.length < keysList.value.length)
      indeterminate.value = true
  }
)
/**
 * 打开选择字段弹框
 */
const openKeyListModal = () => {
  if (!dataListSelections.value.length) return message.error('请勾选需要导出的数据')
  showKeyListModal.value = true
  curVersionType.value = versionTypeList.value[0]['value']
  handleChangeVersionTypeList(curVersionType.value)
}
/**
 * 关闭选择字段弹框
 */
const closeKeyListModal = () => {
  showKeyListModal.value = false
  curVersionType.value = null
}
/**
 * 导出自定义字段excel
 */
const exportKeysExcel = async () => {
  if (!selectedKeys.value.length) return message.error('请勾选需要导出的字段')
  exportLoading.value = true
  let selectedKeysClone: any = []
  keysList.value.forEach((item: any) => {
    selectedKeys.value.forEach((i: any) => {
      if (item.value == i) selectedKeysClone.push(item)
    })
  })
  const [error, res, headers] = await sendRequest({
    module: 'collectProcess',
    api: 'exportCatalogSelectContent',
    override: {
      data: {
        selectFields: selectedKeysClone,
        subItemCodes: subItemCodes.value,
        typeCode: typeCode.value
      }
    }
  })
  exportLoading.value = false
  if (error) return
  download(headers, res, `藏品编目信息表`)
  message.success('导出成功')
  closeKeyListModal()
}
function download(headers: any, data: any, name?: string) {
  const val = headers['content-disposition']?.match(/(?<=filename=)(.*)/)
  let filename = val ? decodeURIComponent(val[0]) : name + '.xlsx'
  if (!filename.includes('xlsx')) {
    filename = filename.replace('xls', 'xlsx')
  }
  const a = document.createElement('a')
  let binaryData = []
  binaryData.push(data)
  a.href = window.URL.createObjectURL(new Blob(binaryData))
  a.download = filename
  a.click()
  window.URL.revokeObjectURL(a.href)
}
/**
 * 选择版本类型
 */
const handleChangeVersionTypeList = async (val: string) => {
  console.log('val: ', val)
  typeCode.value = getTypeCode(val)
  selectedKeys.value = []
  let json = jsonList[val].split(',')
  // const res = await Axios.get(`${import.meta.env.VITE_JSON_API_BASE_URL}/bm_json/${json}.json`)
  let content = []
  for (let i = 0; i < json.length; i++) {
    const item = json[i]
    // const [error, res] = await sendRequest({
    //   module: 'json',
    //   api: 'content',
    //   override: {
    //     params: {
    //       name: `${item}.json`
    //     }
    //   }
    // })
    // if (error) return
    await fetch(`${import.meta.env.VITE_BASE_URL}bm_json/${item}.json`)
      .then((response) => {
        if (!response.ok) {
          throw new Error('Network response was not ok ' + response.statusText)
        }
        return response.json()
      })
      .then((data) => {
        console.log('data: ', data)
        content.push(data)
      })
  }
  let keys = getKeysFnc(content)
  keysList.value = keys
}
/** 获取版本类型code */
const getTypeCode = (val) => {
  let versionTypeItem = versionTypeList.value.find((item) => {
    return item.value == val
  })
  let typeCodeItem = banbenList.value.find((item) => {
    return item.classificationName == versionTypeItem.label
  })
  return typeCodeItem.classificationCode
}
/**
 * 获取字段
 */
const getKeysFnc = (content: Array<any>) => {
  let keys = []
  for (let i = 0; i < content.length; i++) {
    const item = content[i]
    for (let j = 0; j < item.length; j++) {
      const it = item[j]
      for (let k = 0; k < it.elements.length; k++) {
        const i = it.elements[k]
        let tempObj = {
          label: i.formItemProps.label,
          value: i.formItemProps.path
        }
        keys.push(tempObj)
      }
    }
  }
  function unique(keys: any) {
    let tempArr = []
    let obj: any = {}
    for (let i = 0; i < keys.length; i++) {
      const item = keys[i]
      if (!obj[item.value]) {
        tempArr.push(item)
        obj[item.value] = true
      }
    }
    return tempArr
  }
  return unique(keys)
}
/**
 * 全选/取消全选
 */
const handleSelectAll = () => {
  if (selectedKeys.value.length == keysList.value.length) selectedKeys.value = []
  else {
    keysList.value.forEach((item: any) => {
      selectedKeys.value.push(item.value)
    })
    selectedKeys.value = Array.from(new Set(selectedKeys.value))
  }
}
/**
 * 反选
 */
const handleReverseSelect = () => {
  keysList.value.forEach((item: any) => {
    let index = selectedKeys.value.findIndex((it: string | number | undefined) => {
      return it == item.value
    })
    console.log('index: ', index)
    if (index == -1) selectedKeys.value.push(item.value)
    else selectedKeys.value.splice(index, 1)
  })
}
//表格数据
const tableLoading = ref(false)
const tableData: any = ref()
const queryTableDataBefore = () => {
  queryTableData(true)
  // if (
  //   form.itemTypeCode ||
  //   form.itemName ||
  //   form.assessStatusCode ||
  //   form.batchCode ||
  //   form.collectTypeCode
  // ) {
  //   queryTableData()
  // } else {
  //   message.info('请输入查询条件')
  // }
}
const queryTableData = async (resetPage = false) => {
  let params = JSON.parse(JSON.stringify(form))
  if (params.mainStatus) {
    let tempParams: string[][] = []
    let tempParam = params.mainStatus.split('&')
    tempParam.forEach((item: string) => {
      tempParams.push(item.split('='))
    })
    tempParams.forEach((item: string[]) => {
      params[item[0]] = item[1]
    })
    delete params.mainStatus
  }
  if (resetPage) paginationReactive.page = 1
  tableLoading.value = true
  formIds.value = []
  dataListSelections.value = []
  const [error, res] = await sendRequest({
    module: 'collectProcess',
    api: 'collectingItemsList',
    override: {
      params: {
        ...params,
        recipientTimeStart: form.timeRange?.[0],
        recipientTimeEnd: form.timeRange?.[1],
        page: paginationReactive.page,
        limit: paginationReactive.pageSize,
        listType: 2, //1 初编 编目 2 编目审核 3 藏品
        timeRange: null
      }
    }
  })
  if (error) return message.error(error.message)
  const tmp: any = res.data
  tableData.value = tmp?.list
  paginationReactive.itemCount = tmp.totalCount
  console.log(paginationReactive.itemCount)
  tableLoading.value = false
}
const codeFn = async (code: any, refValue: any) => {
  const [error, res] = await sendRequest({
    module: 'collectProcess',
    api: 'listByParentCode',
    override: {
      params: {
        dicCode: code
      }
    }
  })
  if (error) return message.error(error.message)
  if (code == 'A50') {
    //编目审核-去掉未提交
    refValue.value = res?.data
      ?.map((it: any) => {
        return { value: it.dicCode, label: it.dicName }
      })
      .filter((it: any) => it.value != 'A5009')
  } else if (code == 'A67') {
    //入库审核-去掉通过
    refValue.value = res?.data
      ?.map((it: any) => {
        return { value: it.dicCode, label: it.dicName }
      })
      .filter((it: any) => it.value != 'A6704')
  } else {
    refValue.value = res?.data?.map((it: any) => {
      return { value: it.dicCode, label: it.dicName }
    })
  }
}
const keyUpDown = (e: any) => e.key == 'Enter' && ((paginationReactive.page = 1), queryTableData())
onDeactivated(() => window.removeEventListener('keyup', keyUpDown, false))
watch(
  () => route.path,
  () => {
    if (route.path == '/collection/process/stepPlan/index') {
      queryTableData(true)
      window.addEventListener('keyup', keyUpDown, false) // 回车
    }
  },
  { deep: true, immediate: true }
)
const formRules: FormRules = {
  userName: {
    required: true,
    trigger: 'blur',
    message: '用户名不能为空'
  }
}
const getTreeSelect = async () => {
  const [error, res] = await sendRequest({
    module: 'collectProcess',
    api: 'listTreeAll',
    override: {
      params: {
        statusCode: 'A4901'
      }
    }
  })
  if (error) return message.error(error.message)
  banbenList.value = res.data
}
// 状态整合
const mainStatusList = ref([
  {
    label: '编目审核中',
    value: 'assessStatusCode=A5010'
  },
  {
    label: '编目拒绝',
    value: 'assessStatusCode=A5012'
  },
  {
    label: '编目通过',
    value: 'assessStatusCode=A5011'
  },
  {
    label: '审核退回',
    value: 'assessStatusCode=A5004'
  },
  {
    label: '入库审核中',
    value: 'laidStatusCode=A6702'
  },
  {
    label: '入库拒绝',
    value: 'laidStatusCode=A6703'
  }
])
const inStatusList = ref()
const laidOptions = ref()
const menuList = ref()
onMounted(() => {
  getTreeSelect()
  codeFn('A50', statusList) //审核状态A50
  codeFn('A45', menuList) //编目状态A45
  codeFn('A46', inStatusList) //入藏状态A46
  codeFn('A47', piciList) //藏品状态A47
  codeFn('A67', laidOptions) //入库审核状态A67
  codeFn('A30', collectFactionList) //征集方式A30
  // queryTableData()
})
</script>

<template>
  <TableView class="table">
    <template #form>
      <NSpace justify="start">
        <NForm
          require-mark-placement="left"
          :show-feedback="false"
          label-placement="left"
        >
          <NSpace>
            <NFormItem label="批次编号:">
              <NInput
                placeholder="请输入批次编号"
                v-model:value="form.batchCode"
              />
            </NFormItem>
            <NFormItem label="藏品名称:">
              <NInput
                placeholder="请输入藏品名称"
                v-model:value="form.itemName"
              />
            </NFormItem>
            <!-- <NFormItem label="入藏状态:">
              <NSelect
                :options="inStatusList"
                v-model:value="form.storageStatusCode"
                placeholder="请选择入藏状态"
                clearable
                filterable
                style="width: 200px"
              />
            </NFormItem> -->

            <NFormItem label="征集方式:">
              <NSelect
                :options="collectFactionList"
                v-model:value="form.collectTypeCode"
                placeholder="请选择征集方式"
                clearable
                filterable
                style="width: 200px"
              />
            </NFormItem>
            <NFormItem label="版本类型:">
              <n-tree-select
                :options="banbenList"
                children-field="childList"
                key-field="classificationCode"
                label-field="classificationName"
                v-model:value="form.itemTypeCode"
                :render-option="renderOption"
                placeholder="请选择版本类型"
                clearable
                filterable
                style="width: 200px"
              />
            </NFormItem>
            <!-- <NFormItem label="编目状态:">
            <NSelect
              :options="menuList"
              v-model:value="form.catalogStatusCode"
              placeholder="请选择状态"
              clearable
              filterable
              style="width: 150px"
            />
          </NFormItem> -->

            <!-- <NFormItem label="编目审核状态:">
              <NSelect
                :options="statusList"
                v-model:value="form.assessStatusCode"
                placeholder="请选择编目审核状态"
                clearable
                filterable
                style="width: 200px"
              />
            </NFormItem>
            <NFormItem label="入库审核状态:">
              <NSelect
                :options="laidOptions"
                v-model:value="form.laidStatusCode"
                placeholder="请选择入库审核状态"
                clearable
                filterable
                style="width: 200px"
              />
            </NFormItem> -->
            <NFormItem label="状态:">
              <NSelect
                :options="mainStatusList"
                v-model:value="form.mainStatus"
                placeholder="请选择状态"
                clearable
                filterable
                style="width: 200px"
              />
            </NFormItem>
            <!-- <NFormItem label="批次:">
            <NSelect
              :options="piciList"
              v-model:value="form.batchCode"
              placeholder="请选择批次"
              clearable
              filterable
              style="width: 200px"
            />
          </NFormItem> -->

            <NFormItem label="领取人:">
              <NInput
                placeholder="输入领取人"
                v-model:value="form.recipient"
              />
            </NFormItem>
            <NFormItem label="领取时间:">
              <NDatePicker
                input-readonly
                placeholder="请选择领取时间"
                type="daterange"
                value-format="yyyy-MM-dd"
                v-model:formatted-value="form.timeRange"
                style="width: 265px"
                clearable
              />
            </NFormItem>
            <NFormItem label="审核查询:">
              <NSelect
                :options="[
                  { label: '全部', value: 0 },
                  { label: '仅我审核', value: 1 }
                ]"
                v-model:value="form.reviewType"
                placeholder="请选择审核查询"
                clearable
                filterable
                style="width: 200px"
              />
            </NFormItem>
            <NFormItem label="馆藏码:">
              <NInput
                placeholder="输入馆藏码"
                v-model:value="form.assetCode"
              />
            </NFormItem>
            <NFormItem>
              <NButton
                type="primary"
                style="width: 78px; margin-right: 10px"
                ghost
                @click="queryTableDataBefore()"
              >
                查询
              </NButton>
            </NFormItem>
            <NFormItem>
              <NButton
                style="width: 78px; margin-right: 10px"
                ghost
                @click="reset()"
                type="primary"
              >
                重置
              </NButton>
            </NFormItem>

            <NFormItem>
              <NButton
                color="#5FB17F"
                ghost
                @click="
                  () =>
                    router.push({
                      path: '/collection/process/StepPlan/pillContent',
                      query: { type: 2, redirect: router.currentRoute.value.fullPath } //2编目 1初编
                    })
                "
              >
                批量入库
              </NButton>
            </NFormItem>
            <NButton
              color="#5FB17F"
              ghost
              @click="() => handleDetail(formIds?.join(','), true)"
              :disabled="formIds.length ? false : true"
            >
              批量编目审核同意
            </NButton>
            <NButton
              color="red"
              ghost
              @click="() => handleDetail(formIds?.join(','), false)"
              :disabled="formIds.length ? false : true"
            >
              批量编目审核拒绝
            </NButton>
            <NButton
              color="#5FB17F"
              @click="openKeyListModal()"
              :loading="exportLoading"
            >
              <div>
                <div>选择字段导出</div>

                <div
                  style="position: absolute; top: -7px; right: -5px; color: red; font-size: 16px"
                >
                  <n-badge :value="dataListSelections.length" />
                </div>
              </div>
            </NButton>
            <NButton
              color="#5FB17F"
              @click="outputExcelNow()"
              :loading="exportNowLoading"
            >
              导出当前页
            </NButton>
          </NSpace>
        </NForm>
      </NSpace>
      <NSpace align="end">
        <!-- <NButton
            color="#5FB17F"
            ghost
            @click="
              () =>
                router.push({
                  path: '/collection/process/stepPlan/startApprove',
                  query: { id: dataListSelections?.join(','), type: 0 }
                })
            "
            :disabled="dataListSelections.length ? false : true"
          >
            批量终审
          </NButton>
          <NButton
            color="#5FB17F"
            ghost
            @click="
              () =>
                router.push({
                  path: '/collection/process/stepPlan/startApprove',
                  query: { id: dataListSelections?.join(','), type: 0 }
                })
            "
            :disabled="dataListSelections.length ? false : true"
          >
            批量初审
          </NButton> -->
      </NSpace>
    </template>

    <template #table="props">
      <NDataTable
        v-bind="props"
        :bordered="false"
        :row-key="rowKey"
        :columns="columns"
        :data="tableData"
        :loading="tableLoading"
        :checked-row-keys="dataListSelections"
        @update:checked-row-keys="selectionChangeHandle"
      />
    </template>

    <template #pagination>
      <NPagination
        show-size-picker
        show-quick-jumper
        :page-sizes="paginationReactive.pageSizes"
        :item-count="paginationReactive.itemCount"
        :page="paginationReactive.page"
        :page-size="paginationReactive.pageSize"
        @update:page="paginationReactive.onChange"
        @update:page-size="paginationReactive.onUpdatePageSize"
        :suffix="() => '页'"
      >
        <template #prefix>
          <span style="font-size: 14px">共{{ paginationReactive.itemCount }}条</span>
        </template>
      </NPagination>
    </template>
  </TableView>
  <!-- 批量同意和拒绝 -->
  <NModal
    :auto-focus="false"
    v-model:show="modalVisible"
  >
    <VDialogContent
      @close="modalVisible = false"
      @submit="auditBatchOperationFn"
      title="备注"
    >
      <div
        class="backA"
        style="width: 400rem"
      >
        <!-- <div class="topTitle">审核退回</div> -->
        <NForm
          require-mark-placement="left"
          :model="form"
          :rules="formRules"
          ref="baseFormRef"
          label-placement="left"
          label-width="40"
        >
          <NFormItem
            label="备注"
            path="typeTree"
          >
            <NInput
              v-model:value="reasonContent"
              placeholder="备注"
              type="textarea"
              rows="5"
            />
          </NFormItem>
        </NForm>
      </div>
    </VDialogContent>
  </NModal>
  <n-modal
    v-model:show="showKeyListModal"
    preset="card"
    :style="{ width: '60%' }"
    title="选择字段导出"
    size="huge"
    :bordered="false"
  >
    <div class="keylist-header">
      <NSpace>
        <n-select
          v-model:value="curVersionType"
          :options="versionTypeList"
          :style="{ width: '180px' }"
          @update:value="handleChangeVersionTypeList"
        />
        <n-button
          type="primary"
          @click="handleSelectAll"
        >
          {{ selectedKeys.length == keysList.length ? '取消全选' : '全选' }}
        </n-button>
        <n-button
          type="primary"
          @click="handleReverseSelect"
        >
          反选
        </n-button>
      </NSpace>
    </div>
    <NScrollbar
      style="max-height: 400rem"
      trigger="none"
    >
      <n-checkbox-group
        v-model:value="selectedKeys"
        :indeterminate="indeterminate"
      >
        <n-grid
          :x-gap="12"
          :y-gap="8"
          :cols="6"
        >
          <n-gi
            :span="1"
            v-for="(item, index) in keysList"
            :key="index"
          >
            <n-checkbox
              :value="item.value"
              :label="item.label"
            />
          </n-gi>
        </n-grid>
      </n-checkbox-group>
    </NScrollbar>
    <template #footer>
      <n-space justify="end">
        <n-button
          type="tertiary"
          @click="closeKeyListModal"
        >
          取消
        </n-button>
        <n-button
          type="primary"
          :loading="exportLoading"
          @click="exportKeysExcel"
        >
          导出
        </n-button>
      </n-space>
    </template>
  </n-modal>
</template>

<style scoped lang="scss">
.table {
  height: 100%;
  padding: 29px 30px 42px;
}
.backA {
  .topTitle {
    font-size: 22px;
    font-family: PingFangSC, PingFang SC;
    font-weight: 500;
    color: #5fb17f;
    // margin-bottom: 10rem;
  }
}
.keylist-header {
  border-bottom: 1px solid #eeeeee;
  margin-bottom: 12px;
  padding-bottom: 12px;
}
</style>
